<template>
  <a-select
    :disabled='disabled'
    allowClear
    :style="'width:'+width"
    v-model='sValue'
    :placeholder='placeholder'
    show-search
    :filter-option='filterOption'
    @change='onChange'>
    <a-select-option v-for='item in options' :value='item.pcs_id'>
      {{ item.source_name || '-' }}
    </a-select-option>
  </a-select>
</template>
<script>
import PropTypes from 'ant-design-vue/es/_util/vue-types'
import * as Api from '@/api/presales_customer/source'

export default {
  name: 'SelectPresalesSource',
  model: {
    prop: 'value',
    event: 'change'
  },
  props: {
    // 选择框宽度
    width: PropTypes.string.def('140px'),
    // v-model 指定选中项
    value: PropTypes.number.def(),
    // 元素的尺寸(宽)
    placeholder: PropTypes.string.def('请选择'),
    // 锁定
    disabled: PropTypes.bool.def(false)
  },
  data() {
    return {
      // 选中项
      sValue: [],
      // 级联选择器数据
      options: []
    }
  },
  watch: {
    value(val) {
      this.sValue = val || undefined
    }
  },
  created() {
    Api.all().then(res => {
      this.options = res.data.list
    })
  },
  methods: {
    // 触发change事件
    onChange(value) {
      this.$emit('change', value)
    },
    // 多选框搜索配置
    filterOption(input, option) {
      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
    }
  }
}
</script>

<style lang='less' scoped>
</style>
